<script>
import { useUserStore } from '@/store/user'

export default {
	onLaunch: function() {
		console.log('App Launch')
		
		// 初始化用户状态
		const userStore = useUserStore()
		userStore.initUserState()
		
		// 初始化主题
		this.initTheme()
		
		// 获取系统信息
		this.getSystemInfo()
	},
	onShow: function() {
		console.log('App Show')
	},
	onHide: function() {
		console.log('App Hide')
	},
	methods: {
		initTheme() {
			// 初始化主题
			const userStore = useUserStore()
			const themeMode = userStore.themeMode || 'light'
			
			// #ifdef H5
			// H5平台设置data-theme属性
			document.documentElement.setAttribute('data-theme', themeMode)
			// #endif
		},
		
		getSystemInfo() {
			// 获取系统信息并存储
			const systemInfo = uni.getSystemInfoSync()
			uni.setStorageSync('systemInfo', systemInfo)
			
			// 设置页面基础样式
			const style = `
				:root {
					--status-bar-height: ${systemInfo.statusBarHeight}px;
					--window-height: ${systemInfo.windowHeight}px;
					--window-width: ${systemInfo.windowWidth}px;
				}
			`
			
			// #ifdef H5
			const styleEl = document.createElement('style')
			styleEl.innerHTML = style
			document.head.appendChild(styleEl)
			// #endif
		}
	}
}
</script>

<style>
	/*每个页面公共css */
	
	/* 全局样式 */
	page {
		font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', SimSun, sans-serif;
		line-height: 1.6;
		color: #333333;
		background-color: #f5f5f5;
	}
	
	/* 重置样式 */
	view, scroll-view, swiper, button, input, textarea, label, navigator, image {
		box-sizing: border-box;
	}
	
	/* 通用工具类 */
	.flex {
		display: flex;
	}
	
	.flex-column {
		flex-direction: column;
	}
	
	.flex-center {
		align-items: center;
		justify-content: center;
	}
	
	.flex-between {
		justify-content: space-between;
	}
	
	.flex-around {
		justify-content: space-around;
	}
	
	.flex-1 {
		flex: 1;
	}
	
	.text-center {
		text-align: center;
	}
	
	.text-left {
		text-align: left;
	}
	
	.text-right {
		text-align: right;
	}
	
	.text-ellipsis {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	
	.text-ellipsis-2 {
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}
	
	/* 颜色类 */
	.color-primary {
		color: #1890ff;
	}
	
	.color-success {
		color: #52c41a;
	}
	
	.color-warning {
		color: #faad14;
	}
	
	.color-error {
		color: #ff4d4f;
	}
	
	.color-text {
		color: #333333;
	}
	
	.color-text-secondary {
		color: #666666;
	}
	
	.color-text-placeholder {
		color: #999999;
	}
	
	/* 背景色类 */
	.bg-primary {
		background-color: #1890ff;
	}
	
	.bg-success {
		background-color: #52c41a;
	}
	
	.bg-warning {
		background-color: #faad14;
	}
	
	.bg-error {
		background-color: #ff4d4f;
	}
	
	.bg-white {
		background-color: #ffffff;
	}
	
	.bg-gray {
		background-color: #f5f5f5;
	}
	
	/* 间距类 */
	.margin-0 { margin: 0; }
	.margin-1 { margin: 20rpx; }
	.margin-2 { margin: 40rpx; }
	.margin-3 { margin: 60rpx; }
	
	.margin-top-0 { margin-top: 0; }
	.margin-top-1 { margin-top: 20rpx; }
	.margin-top-2 { margin-top: 40rpx; }
	.margin-top-3 { margin-top: 60rpx; }
	
	.margin-bottom-0 { margin-bottom: 0; }
	.margin-bottom-1 { margin-bottom: 20rpx; }
	.margin-bottom-2 { margin-bottom: 40rpx; }
	.margin-bottom-3 { margin-bottom: 60rpx; }
	
	.padding-0 { padding: 0; }
	.padding-1 { padding: 20rpx; }
	.padding-2 { padding: 40rpx; }
	.padding-3 { padding: 60rpx; }
	
	.padding-horizontal-1 { padding-left: 20rpx; padding-right: 20rpx; }
	
	/* 主题相关样式 */
	.theme-transition {
		transition: all 0.3s ease;
	}
	
	/* 深色模式样式 - 深灰色方案 */
	[data-theme="dark"] page {
		background-color: #1e1e1e !important;
		color: #e8e8e8 !important;
	}
	
	[data-theme="dark"] .bg-white {
		background-color: #252526;
	}
	
	[data-theme="dark"] .bg-gray {
		background-color: #1e1e1e;
	}
	
	[data-theme="dark"] .color-text {
		color: #e8e8e8;
	}
	
	[data-theme="dark"] .color-text-secondary {
		color: #b3b3b3;
	}
	
	[data-theme="dark"] .color-text-placeholder {
		color: #8c8c8c;
	}
</style>
